<template>
  <!--多级菜单-->
  <el-submenu :index="item.path" v-if="item.children && !item.nonRenderChild">
    <template #title>{{ item.meta.title }}</template>
    <GMenuItem
      v-for="(child, index) in item.children"
      :key="index"
      :item="child"
    />
  </el-submenu>
  <!--一级菜单-->
  <el-menu-item :index="item.path" v-else>
    <template #title>
      <i class="el-icon-menu"></i>
      <span>{{ item.meta.title }}</span>
    </template>
  </el-menu-item>
</template>

<script>
export default {
  name: 'GMenuItem',
  props: {
    item: {
      type: Object,
      required: true
    }
  }
}
</script>
